<!DOCTYPE html>
<html>

<head>

    {include file="Public/header"}
    <link href="__STATIC__/layout/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="__STATIC__/layout/css/plugins/webuploader/webuploader.css">
    <link rel="stylesheet" type="text/css" href="__STATIC__/layout/css/demo/webuploader-demo.css">
    <style>
        .radio-inline input[type=radio] {
            margin-top: 0px
        }
        .colorRed{color:red;}
        .bqName{padding: 2px 4px;border-radius: 6px;background: #f66;cursor: pointer;}
    </style>

</head>

<body class="white-bg" style="color:#333;padding:3px;">
<div class="row white-bg setRemindPeopleK" style="margin:10px">

    <form action="" class="form-inline" id="add" method="post">
        <table class="table table-bordered">
            <tr>
                <td colspan="4">
                    温馨提醒:<br>
                    1 已进场条码在这里补录.<br>
                    2 已进场条码不允许重复进场.如需进场请先退场之前的条码再进场<br>
                    3 新增网点产品未有进场不需要维护条码,要打进场申请.进场申请生效后本次进场条码会自动录入到这里的已进场条码中.<br>
                    4 进场费是指本次条码进场时所花费的总金额,如果多个条码同时进场,则会根据条码数量对金额金星平分.<br>
                    5 零售价是指本次进场条码的终端零售价,如果多个条码同时进场,且填写了零售价,则本次进场所有条码零售价都默认是填写的价格.
                </td>
            </tr>
            <tr>
                <td class="text-right"><label for="" style="min-width: 160px;width: 160px">本次进场条码<font color="red">*</font></label></td>
                <td colspan="3">
                    <div class="col-xs-8">
                        <div class="input-group">
                            <input name="stuff" id="testNoBtn" type="text" placeholder="请输入关键字或空格查询"
                                   class=" form-control" value="">
                            <div class="input-group-btn">
                                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                                    <span class="caret"></span>
                                </button>
                                <ul class="dropdown-menu dropdown-menu-right" role="menu">
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-2">
                        <a href="javascript:;" id="select" class="btn btn-default btn-outline">选择</a>
                    </div>
                </td>

            </tr>
            <tr>
                <td></td>
                <td id="thisdiv" colspan="3"> 
                    <div class="renyuan" id="renyuan" style="position: relative;top:0;left:0">
                                {if isset($data)&&is_array($data)}
                                {volist name="data" id="row"}
                                <span class="ren" data-id="{$row.id}">{$row.em_name}<span class="close">×</span></span>
                                {/volist}
                                {/if}
                            </div>
                </td>
            </tr>
            <tr>
                <td class="text-right">进场时间<font color="red">*</font></td>
                <td><input type="text" name="intime" class="form-control" onclick="laydate()"></td>
                <td class="text-right">合计进场费(元)<font color="red">*</font></td>
                <td><input type="text" name="infee" class="form-control" ></td>
            </tr>
            <tr>
                <td class="text-right">卖场零售价<font color="red">*</font></td>
                <td colspan="3">
                    <input type="text" name="retailPrice" class="form-control" >
                </td>
            </tr>

        </table>
        <div class="col-md-12 text-center" style="padding: 10px 0">
            <button class="btn-success btn" id="tijiao">保存</button>
            <button class="btn-warning btn" id="cancelBack">返回</button>
        </div>

    </form>
</div>

<!-- 全局js -->
{include file="Public/footer"}
<script src="__STATIC__/layout/js/plugins/layer/laydate/laydate.js"></script>
<script src="__STATIC__/layout/js/plugins/suggest/bootstrap-suggest.min.js"></script>
<script>
    var cancelBack = document.getElementById('cancelBack')
    cancelBack.onclick = function () {
        var index = top.layer.getFrameIndex(window.name);
        top.layer.close(index);
    }

    //提交
    $('#tijiao').on('click',function () {
        var form =  $('#add')
        var ren = []
        $('#renyuan .ren').each(function(i,o){
            ren.push($(o).data('id'))
        })
        var intime = $('input[name=intime]').val();
        var infee = $('input[name=infee]').val();
        var retailPrice = $('input[name=retailPrice]').val();

        $.ajax({
            'type':'post',
            'url':form.attr('action'),
            'data':{net_id:'{:request()->param("id")}',intime:intime,infee:infee,retailPrice:retailPrice,ren:ren},
            'dataType':'json',
            'success':function (data) {
                if(data.success){
                    top.swal({
                        title: data.msg,
                        type: "success"
                    },function(){
                        top.layer.close(top.layer.getFrameIndex(window.name))
                        });

                }else
                    top.swal({
                        title: data.msg,
                        type: "warning"
                    });
            }
        })
        return false
    })

    $('#renyuan').on('click','.ren .close',function () {
        $(this).closest('.ren').remove()
    })
    /**
     * touxingren (首次从 URL 获取数据，显示 header，不显示按钮，忽略大小写，可清除)
     */
    $("#testNoBtn").bsSuggest({
        url: "{:url('select/product')}",
        /*effectiveFields: ["userName", "shortAccount"],
         searchFields: [ "shortAccount"],*/
        effectiveFieldsAlias: {title: "产品名称"},
        ignorecase: true,
        showHeader: true,
        showBtn: false,     //不显示下拉按钮
        delayUntilKeyup: true, //获取数据的方式为 firstByUrl 时，延迟到有输入/获取到焦点时才请求数据
        idField: "id",
        keyField: "title",
        clearable: true
    }).on('onDataRequestSuccess', function (e, result) {
        console.log('onDataRequestSuccess: ', result);
    }).on('onSetSelectValue', function (e, keyword, data) {
        $(this).val('')
        var bool = false
        $('#renyuan .ren').each(function (idx, o) {
            if ($(this).data('id') == keyword.id) {
                bool = true;
            }
        })
        if (bool == false)
            $('#renyuan').append('<span class="ren" data-id="' + keyword.id + '">' + keyword.key + '<span class="close">×</span></span>')
        //console.log('onSetSelectValue: ', keyword, data);
    }).on('onUnsetSelectValue', function () {
        console.log("onUnsetSelectValue");
    });

    //弹窗选择人员
    $('#select').on('click', function () {
        var index = layer.getFrameIndex(window.name)
        //iframe层-父子操作
        top.layer.open({
            type: 2,
            title: '请选择',
            area: ['500px', '400px'],
            fixed: false, //不固定
            maxmin: true,
            content: '{:url("open/product")}?frameindex=' + index,
            btn:['确定','取消'],
            yes:function (i,o) {
                var a = $(o).find('iframe').contents()
                var data = a.find('#data')
                data = data.val()
                data = JSON.parse(data)
                var bool = false
                for(var j=0;j<data.length;j++){
                    $('#renyuan .ren').each(function (idx, o) {
                        if ($(this).data('id') == data[j].id) {
                            bool = true;
                        }
                    })
                    if (bool == false)
                        $('#renyuan').append('<span class="ren" data-id="' + data[j].id + '">' + data[j].title + '<span class="close">×</span></span>')

                }
                top.layer.close(i)

            }
        });
        return false
    })


</script>

</body>

</html>